//绝对路径 @ 标识 src 文件夹
import FindPage from "@/views/FindPage.vue"
import MyMusic from "@/views/MyMusic.vue"
import MyFriend from '@/views/FriendPage.vue';
import PageNotFind from '@/views/PageNotFind.vue';
import VueRouter from "vue-router";
import Vue from 'vue'
//使用步骤
//1.下载
//2.引入
//3.安装注册Vue.use
//4.创建路由对象
//5.注入到new.Vue中，建立关联
Vue.use(VueRouter) //vuerouter插件初始化
const router = new VueRouter({
        //routes 路由规则集
        //route 一条路由规则{path:路径, component：组件}
        routes: [
            { path: "/", redirect: '/find' },
            // 路由重定向，匹配path后，强制跳转至另一个path
            { path: "/find", component: FindPage },
            { name: "msc", path: "/myMusic/:music?", component: MyMusic },
            //动态路由传参 ?为动态路由参数可选符 添加该符号即可使参数为可选状态，当未传参数时不会导致路由不匹配
            { path: "/myFriend", component: MyFriend },
            { path: "*", component: PageNotFind }
            //路由404，当所有规则均不匹配时触发，显示提示信息，应放至路由规则最后一条
        ],
        linkActiveClass: 'shio',
        //配置项 linkActiveClass 可配置模糊匹配路径高亮的类名
        linkExactActiveClass: 'koube',
        //配置项 linkExactActiveClass 可配置精确匹配路径高亮的类名
        mode: "history"
            //配置项history 可配置路径显示方式为history路由（不含#号的路径），需后台配置访问规则
    }) //创建对象若命名为其他名称，则不能简写
export default router //导出路由规则